import "./index.scss";
import { Toast } from 'antd-mobile';
import { setComment, setReply } from "../../action/action";
import { getCommentList } from './../../action/action';

export class AddComment extends React.Component {
    addComment(vid, uid, utel, reply, _id) {
        let { dispatch } = this.props;
        if (this.refs.textarea.value != "") {
            if (reply) {
                dispatch(setReply(this.refs.textarea.value, vid, uid, utel, _id, (data) => {
                    if (data.code == 1) {
                        Toast.success("评论成功", 1);
                        this.refs.textarea.value = "";
                        dispatch(getCommentList(vid, (data) => { }));
                    } else {
                        Toast.fail("评论失败", 1);
                    }
                }))
            } else {
                dispatch(setComment(this.refs.textarea.value, vid, uid, utel, (data) => {
                    if (data.code == 1) {
                        Toast.success("评论成功", 1);
                        this.refs.textarea.value = "";
                        dispatch(getCommentList(vid, (data) => { }));
                    } else {
                        Toast.fail("评论失败", 1);
                    }
                }));
            }
            this.refs.addcomment.parentElement.nextElementSibling.style.display = "block";
            this.refs.addcomment.style.display = "none";
        } else {
            Toast.info("评论内容不能为空！", 1);
        }
    }
    render() {
        let { video, userData, author, content, reply, _id } = this.props;
        return (
            <div className="add-comment" ref="addcomment">
                <header>
                    <i className="iconfont icon-chahao" onClick={() => { this.refs.addcomment.parentElement.nextElementSibling.style.display = "block"; this.refs.addcomment.style.display = "none"; }}></i>
                    <div><h3>{reply ? "@" + author : "评论"}</h3><p>{reply ? content : ""}</p></div>
                    <i className="iconfont icon-duigou" onClick={() => this.addComment(video.videoData.id, userData.result._id, userData.result.utel, reply, _id)}></i>
                </header>
                <main>
                    <textarea ref="textarea" placeholder="发表你的评论..."></textarea>
                </main>
            </div>
        )

    }
}